'use strict';

import React, { Component,DrawerLayoutAndroid,View,Text} from 'react-native';
import {bindActionCreators} from 'redux';
import * as mainScreenActions from '../actions/mainScreenActions';
import { connect } from 'react-redux';
import MainScreen from './mainScreen';
import DrawerView from '../components/drawer/drawerview'

// @connect(state => ({
//   state: state.counter
// }))
// 
class bw800App extends Component {
  constructor(props) {
    super(props);
  }
  openDrawer= ()=> {
    this.refs['DRAWER'].openDrawer()
  };
  render() {
    var navigationView = (
      <View style={{flex: 1, backgroundColor: '#fff'}}>
        <DrawerView></DrawerView>
      </View>
    );
    return (

      <DrawerLayoutAndroid
          //打开时的抽屉宽度
          drawerWidth={280}
          ref={'DRAWER'}
          //左边弹出
          drawerPosition={DrawerLayoutAndroid.positions.Left}
          //弹出的页面
          renderNavigationView={() => navigationView}>
            {/*不显示抽屉时的页面*/}
            <View style={{flex: 1,alignSelf:'stretch'}}>
              <MainScreen mapstate={this.props.mapstate} mapactions={this.props.mapactions} openDrawer={this.openDrawer}></MainScreen>
            </View>
      </DrawerLayoutAndroid>
    );
  }
}

//将全局state绑定到组件的props中
function mapStateToProps(state) {
  return { 
    //state字段key
    mapstate: state.mainScreenRedux,//在上面的组件实例化时存入 
  }
}

//绑定一个方法到props中
function mapDispatchToProps(dispatch) {
  return { 
    mapactions: bindActionCreators(mainScreenActions, dispatch) 
  }
}

//将全局的state绑定到组件中
export default connect(mapStateToProps,mapDispatchToProps)(bw800App);
